<template>
  <div id="about-main">
    <div class="info">
      <a-descriptions title="小明云存储">
        <a-descriptions-item label="作者">
          {{ aboutInfo.author }}
        </a-descriptions-item>
        <a-descriptions-item label="版本">
          {{ aboutInfo.version }}
        </a-descriptions-item>
        <a-descriptions-item label="官网">
          <a target="_blank" :href="aboutInfo.official">点击访问</a>
        </a-descriptions-item>
        <a-descriptions-item label="反馈">
          {{ aboutInfo.feedback }}
        </a-descriptions-item>
        <a-descriptions-item label="QQ群">
          {{ aboutInfo.qqGroup }}
        </a-descriptions-item>
      </a-descriptions>
    </div>
  </div>
</template>
<script>
import storage from 'store'
import { ABOUT_INFO } from '@/store/mutation-types'

export default {
  data() {
    return {
      aboutInfo: {}
    };
  },
  mounted() {
    this.getAbout();
  },
  methods: {
    getAbout () {
      const about = storage.get(ABOUT_INFO);
      this.aboutInfo = about ? about : {};
    },
  },
};
</script>
<style lang="less" scoped>
#about-main {
  .info {
    // border-top: 1px dashed #e8e8e8;
    // border-bottom: 1px dashed #e8e8e8;
    color: #000;
    padding: 9px 10px;
    text-align: left;
    a:link {
      color: #000;
    }
    a:hover{ 
      color:#1890ff;
    }
  }
}
</style>
